<template>
  <a-drawer
      v-model:visible="visible"
      :title="title"
      :mask-closable="false"
      :esc-to-close="false"
      :width="width >= 1350 ? 1350 : '100%'"
      @before-ok="save"
      @close="reset"
  >
    <a-tabs v-model:active-key="activeKey">
      <a-tab-pane key="1" title="基础命名">
        <template #title>
          <a-space>
          <icon-command />基础命名
            </a-space>
        </template>
        <config-base  ref="configBaseRef" v-model="form"></config-base>
      </a-tab-pane>

      <a-tab-pane key="2" >
        <template #title>
          <a-space>
          <icon-list />字段列表
           </a-space>
        </template>
            <config-column ref="configColumnRef" v-model="dataList" :dict-list="dictList"></config-column>
      </a-tab-pane>

      <a-tab-pane key="3" >
        <template #title>
          <a-space>
            <icon-edit />编辑
          </a-space>
        </template>
        <config-column-edit  ref="configColumnEditRef" v-model:form="editForm" v-model:list="editDataList" :dict-list="dictList"></config-column-edit>
      </a-tab-pane>

      <a-tab-pane key="4" >
        <template #title>
          <a-space>
            <icon-delete />删除
          </a-space>
        </template>
        <config-column-del ref="configColumnDelRef" v-model="delForm"></config-column-del>
      </a-tab-pane>

      <a-tab-pane key="5" >
        <template #title>
          <a-space>
            <icon-search />搜索
          </a-space>
        </template>
       <config-column-search  ref="configColumnSearchRef" v-model:list="searchDataList" :dataList="dataList" :column-config="columnConfig" :dict-list="dictList"></config-column-search>

      </a-tab-pane>

    </a-tabs>


  </a-drawer>
</template>

<script setup lang="ts">
import {Message, SelectOptionData} from '@arco-design/web-vue'
import {useWindowSize} from '@vueuse/core'
import {
  getColumnsConfig,
  saveColumnsConfig,
  type FieldConfigResp,
  type FieldEditConfigListResp,
  type FieldEditConfigFormResp,
  type FieldDeleteConfigFormResp,
  type FieldSearchConfigListResp,
  type GeneratorConfigResp,
} from '@/api/system/code'
import {getList as getDictList, type DictResp} from '@/api/system/dict'
import { type Options,BhForm} from '@/components/BhForm'
import {useLoading} from '@/hooks/modules/useLoading';
import {useResetReactive} from '@/hooks/modules/useResetReactive'
import {AnyObject} from "@/types/global";
import ConfigBase from "./component/ConfigBase.vue";
import ConfigColumn from "./component/ConfigColumn.vue";
import ConfigColumnEdit from "./component/ConfigColumnEdit.vue";
import ConfigColumnDel from "./component/ConfigColumnDel.vue";
import ConfigColumnSearch from "./component/ConfigColumnSearch.vue";
import {isObject} from "xe-utils";

const emit = defineEmits<{
  (e: 'save-success'): void
}>()
const {width} = useWindowSize()
const title = ref('')
const activeKey = ref('1')
const visible = ref(false)
const dataList = ref<FieldConfigResp[]>([])
const editDataList = ref<FieldEditConfigListResp[]>([])
const searchDataList = ref<FieldSearchConfigListResp[]>([])
const dictList = ref<DictResp[]>()
const columnConfig= ref<Array<AnyObject>>([]);
const {loading, setLoading} = useLoading();



const configBaseRef = ref<InstanceType<typeof ConfigBase>>()
const configColumnRef = ref<InstanceType<typeof ConfigColumn>>()
const configColumnEditRef = ref<InstanceType<typeof ConfigColumnEdit>>()
const configColumnDelRef = ref<InstanceType<typeof ConfigColumnDel>>()
const configColumnSearchRef = ref<InstanceType<typeof ConfigColumnSearch>>()

const options: Options = {
  form: {size: 'large'},
  btns: {hide: true},
}

const [form, resetForm] = useResetReactive({})
const [editForm, editResetForm] = useResetReactive({})
const [delForm, delResetForm] = useResetReactive({})

// 查询数据
const getDataList = async (tableName: string) => {
  try {
    loading.value = true
    const {data} = await getColumnsConfig(tableName)
    Object.assign(form, data.base)
    dataList.value = (data.base_list as unknown as FieldConfigResp[])
    editDataList.value =  (data.edit_config.list as unknown as FieldEditConfigListResp[])
    searchDataList.value =  (data.search_config.list as unknown as FieldSearchConfigListResp[])
    Object.assign(editForm, data.edit_config.from as unknown as FieldEditConfigFormResp)
    Object.assign(delForm, data.delete_config.from as unknown as FieldDeleteConfigFormResp)

    if(dataList.value.length >0){

      dataList.value.map((s) => {
            // 当前节点
            const node={
              label: `${s.column_name} (${s.column_comment})`,
              value: s.column_name,
            } as unknown as SelectOptionData;
        columnConfig.value.push(node)
          })

    }
  } finally {
    loading.value = false
  }
}
// 查询字典数据
const getDictListColumns = async () => {
  try {
    loading.value = true
    const {data} = await getDictList({})
    dictList.value = data
  } finally {
    loading.value = false
  }
}

// 重置
const reset = () => {
  columnConfig.value=[]
  resetForm()
}
// 打开
const onOpen = async (tableName: string, comment: string) => {
  reset()
  comment = comment ? `（${comment}）` : ' '
  title.value = `${tableName}${comment}配置`
  visible.value = true

  await getDictListColumns()
  // 查询字段配置
  await getDataList(tableName)
}


// 保存
const save = async () => {
  try {
    const baseValidate=await configBaseRef.value?.onValidate()
    if(baseValidate)
    {
      activeKey.value = '1'
      Message.error('选项【基础命令】,请填写完必填字段')
      return false
    }

    const columnValidate=await configColumnRef.value?.onValidate()
    if(columnValidate){
       activeKey.value = '2'
      Message.error('选项【字段列表】'+columnValidate)
       return false
    }
    const columnEditValidate=await configColumnEditRef.value?.onValidate()
    if(columnEditValidate){
      activeKey.value = '3'
      if(!isObject(columnEditValidate)){
        Message.error('选项【编辑】'+columnEditValidate)
      }else{
        Message.error('选项【编辑】,请填写完必填字段')
      }
      return false
    }
    const columnDelValidate=await configColumnDelRef.value?.onValidate()
    if(columnDelValidate){
      activeKey.value = '4'
      if(!isObject(columnDelValidate)){
        Message.error('选项【删除】'+columnDelValidate)
      }else{
        Message.error('选项【删除】,请填写完必填字段')
      }
      return false
    }

    const columnSearchValidate=await configColumnSearchRef.value?.onValidate()
    if(columnSearchValidate){
      activeKey.value = '5'
      if(!isObject(columnSearchValidate)){
        Message.error('选项【搜索】'+columnSearchValidate)
      }else{
        Message.error('选项【搜索】,请填写完必填字段')
      }
      return false
    }

    const postData={
      gen_base: form,
      gen_base_list: dataList.value,
      gen_edit_form: editForm,
      gen_edit_list: editDataList.value,
      gen_del_form: delForm,
      gen_search_list: searchDataList.value,
    }
    await saveColumnsConfig(postData as unknown as GeneratorConfigResp)
    Message.success('保存成功')
     emit('save-success')
    return true
  } catch (error) {
    console.log(error)
    return false
  }
}



defineExpose({onOpen})
</script>

<style scoped lang="less">

</style>
